<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
	pageEncoding="ISO-8859-1"%>
<%@ taglib uri="http://www.extremecomponents.org" prefix="ec"%>
<%@taglib uri="http://www.springframework.org/tags" prefix="spring"%>
<%@taglib uri="http://www.springframework.org/tags/form" prefix="form"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>SIB - Proveedor</title>


<!-- Extream Component -->
<link rel="stylesheet" type="text/css"
	href="../resources/css/extremecomponents.css">
<script type="text/javascript"
	src="../resources/javascript/extremecomponents.js"></script>

<script type="text/javascript" src="../resources/javascript/jquery.js"></script>

<script type="text/javascript">
	function onTableClick(idProveedor, nombreProveedor, nitProveedor,
			telefonoProveedor, correoProveedor) {

		$("#idProveedor").val(idProveedor);
		$("#nombreProveedor").val(nombreProveedor);
		$("#nitProveedor").val(nitProveedor);
		$("#telefonoProveedor").val(telefonoProveedor);
		$("#correoProveedor").val(correoProveedor);
		showEditBtn();
	}

	function showEditBtn() {
		$(".btnEditar").hide("fast");
		$(".btnAgregar").hide("slow");
		$(".btnEditar").show("slow");

	}

	function hiddenEditBtn() {
		$(".btnEditar").hide("fast");
		$(".btnAgregar").show("slow");
	}
</script>
<script type="text/javascript">
	$(document).ready(function () {
		
		
		$("#proveedor").validate();
			
		});
	</script>
	<jsp:include page="includeCSSjs.jsp" />
</head>
<body>
	<h2 class="divTextoEncabezado">Catalogo Proveedor</h2>
	<div id="divOverflown">

		<form:form method="post" action="proveedor/add"
			commandName="proveedor">

			<table>
				<form:hidden path="idProveedor" />
				<tr>
					<td><form:label path="nombreProveedor" class="text0">Nombre</form:label></td>
					<td><form:input path="nombreProveedor"
							class="required inputTextFacturaAgregar" /></td>
				</tr>
				<tr>
					<td><form:label path="nitProveedor" class="text0">NIT</form:label></td>
					<td><form:input maxlength="14" path="nitProveedor"   onkeypress="return soloNumeros(event)"
							class=" required inputTextFacturaAgregar" /></td>
				</tr>
				<tr>
					<td><form:label path="telefonoProveedor" class="text0">Telefono</form:label></td>
					<td><form:input maxlength="8" path="telefonoProveedor"  onkeypress="return soloNumeros(event)"
							class="{required:true,minlength:8} required inputTextFacturaAgregar" /></td>
				</tr>
				<tr>
					<td><form:label path="correoProveedor" class="text0">Correo</form:label></td>
					<td><form:input path="correoProveedor" id="correoProveedor" onKeyUp="validateMail('correoProveedor')"
							class="inputTextFacturaAgregar" /></td>
				</tr>

			</table>

			<center>
				<div class='btnAgregar'>
					<input type=image src="../resources/img/boton_agregar.png"
						width="95" height="30" class="inputBoton">
				</div>
				<div class="btnEditar" style="display: none;">
					<input type=image src="../resources/img/boton_guardar.png"
						width="95" height="30" class="inputBoton"
						onclick="edit('proveedor','proveedor/edit')"> 
					<input type=image src="../resources/img/btn_eliminar.png" width="95"
						height="30" class="inputBoton"
						onclick="edit('proveedor','proveedor/delete')"> 
					<input type=image src="../resources/img/btn_cancelar.png" width="95" height="30"
						class="inputBoton" onclick="edit('proveedor','../admin/proveedor')">					
				</div>
			</center>
		</form:form>

		<!-- Extreme Table  -->
		<c:if test="${!empty proveedorList}">
			<ec:table items="proveedorList"
				action="${pageContext.request.contextPath}/admin/proveedor"
				view="compact"
				imagePath="${pageContext.request.contextPath}/resources/images/compact/*.gif"
				rowsDisplayed="8" var="prov">

				

				<ec:row highlightRow="true"
					onclick="onTableClick('${pageScope.prov.idProveedor}',
    					'${pageScope.prov.nombreProveedor}',
    					'${pageScope.prov.nitProveedor}',    					
    					'${pageScope.prov.telefonoProveedor}',
    					'${pageScope.prov.correoProveedor}');">
					
					<ec:column property="nombreProveedor" title="Nombre Proveedor" />
					<ec:column property="nitProveedor" title="NIT" />
					<ec:column property="telefonoProveedor" title="Tel." />
					<ec:column property="correoProveedor" title="E-mail" />
				</ec:row>
			</ec:table>
		</c:if>

	</div>
</body>
</html>